import './style.scss';
import { Col, Row, Input, message} from 'antd';
import React, { useEffect, useState } from "react";
import PersonData from '@/pages_PC/DashboardContent/PersonData';
import PlatformData from '@/pages_PC/DashboardContent/PlatformData';
import SixMoney from '@/pages_PC/DashboardContent/SixMoney';
import Sidefunction from './Sidefunction';

import baoshi from '@/assets/icons/baoshi.png';
import jiantou from '@/assets/icons/jiantou.png';
import chargeIcon from '@/assets/icons/charge-icon.png';
import moneyIcon from '@/assets/icons/money-icon.png';
import nftImg from '@/assets/icons/nftimg.png';
import bill from '@/assets/icons/bill.png';
import link from '@/assets/icons/link.png';
import moneyBag from '@/assets/icons/moneyBag.png';
import extract from '@/assets/icons/extract.png';
import rankinglist from '@/assets/icons/rankinglist.png';
import { useNavigate } from 'react-router-dom';
import { get_platform_trade, get_user_trade, get_user_reward, get_user_vip, user_bind_invitation } from '@/utils/mixin.ts'

const DashboardContent = () => {
    const navigate = useNavigate()
    const [platformData, setPlatformData] = useState([{ total_reward: 0, total_share_points: 0, trade_volume: 0 }]); 
    const [trade, setTrade] = useState([]); 
    const [reward, setReward] = useState([]);
    const [referralCode, setReferralCode] = useState([]);
    const [referralCodeValue, setReferralCodeValue] = useState(''); 
    // useEffect 第二个参数为空数组表示仅在组件挂载时执行
    useEffect(() => {
        // 这里是 componentDidMount 的逻辑
        // console.log("Component is mounted");
        // const res = get_platform_trade({currency: 'BNB'})
        
        // 如果有清理逻辑，例如清理定时器，可以在这里添加
        // return () => {
        //   console.log("Component will unmount");
        //   // 清理逻辑
        // };
        const fetchData = async () => {
            try {
                const res = await get_platform_trade({ currency: 'BNB' });
                setPlatformData(res.data);

                const res1 = await get_user_trade({ email: localStorage.getItem('email') });
                setTrade(res1.data);

                const res2 = await get_user_reward({ email: localStorage.getItem('email') });
                setReward(res2.data);

            } catch (error) {
                console.error("Error fetching data:", error);
            }
        };

        fetchData(); // 组件挂载时执行一次

        // 获取vip信息
        get_user_vip({
            email: localStorage.getItem('email')
        }).then((res) => {
            if (res) {
                setReferralCode(res.data.invite_code);
            }
        });
      }, []);  // 空数组表示只在组件挂载时执行

      const toPage = (path) => {
        navigate(path)
    }
    
    const bindingReferralCode = () => {
        if(!referralCodeValue) return
        user_bind_invitation({
            email: localStorage.getItem('email'),
            invite_code: referralCodeValue
        }).then(res=> {
            if (res && res.code == 0) {
                message.success('绑定成功');
                setReferralCodeValue('');
            } else {
                message.error('绑定失败');
            }
        })
    }

    const copyToClipboard = (text) => {
        if(!text) return
        const tempInput = document.createElement('input');
        tempInput.value = text;
        document.body.appendChild(tempInput);
        tempInput.select();
        tempInput.setSelectionRange(0, 99999);
        document.execCommand('copy');
        document.body.removeChild(tempInput);
        message.success('复制成功')
      };
    
    return (
        <>
            <Row className="main">
                <Col span={17} className="dashboard-content-container">
                    <div>
                        <PersonData />
                        <Row className="platform-part" gutter={[16, 0]}>
                            <Col xl={10} lg={12}>
                                <PlatformData />
                            </Col>
                            <Col xl={14} lg={12}>
                                <SixMoney />
                            </Col>
                        </Row>
                    </div>
                </Col>

                <Col span={7} className="dashboard-content-right">
                    <Sidefunction />
                </Col>
            </Row>


        </>
    );
};

export default DashboardContent;
